-
Notifications
You must be signed in to change notification settings - Fork 3.6k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(ui): Add custom time range option in time range dropdown #11990
Conversation
6367b0e
to
ea26a71
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wonderful
private get stylePosition(): CSSProperties { | ||
const {position} = this.props | ||
const {bottomPosition, topPosition} = this.state | ||
const pickerHeight = 410 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
nit Want to extract this to a named screaming snake case constant at the top of the file?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
can do
} | ||
|
||
const bottomPx = | ||
(bottomPosition || window.innerHeight - top - 15) - pickerHeight / 2 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What's the 15
for?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
some additional padding; i can make into a constant
(bottomPosition || window.innerHeight - top - 15) - pickerHeight / 2 | ||
return { | ||
bottom: `${bottomPx}px`, | ||
right: `${right + 2}px`, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
What's the 2
for?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
some additional padding; i can make it into a named constant
ea26a71
to
f0e7f30
Compare
Co-authored-by: Daniel Campbell <[email protected]>
f0e7f30
to
f9aab0f
Compare
Closes #11692
Briefly describe your proposed changes:
Add a '
Custom Time Range
option to the timerange dropdown that opens a calendar selection to choose the time rangeChange the clickOutside component to listen to
mousedown
rather thanclick
Add react-datepicker as dependency
add stop to queries built by the query builder that default to
now()
if a custom time is not selected